<style>
    .tableContentAdjust{
        text-align: center;
        vertical-align: middle;
    }
    .inputStyle{
        width:100%;
        background-color: inherit;
        border: none;
    }
    @media print {
        .noprint {
            display: none
        }
        table, th, td {
            height: 40px;
            border: 1px solid #C7C7C7;
        }
        .border1{
            border:1px solid #C7C7C7;
        }
        input{
            border:none;
        }
    }
</style>
<div class="ribbon border1">
    <a href=""><span class="home fa fa-home"></span></a>
    <ol class="breadcrumb">
        <li>今日实际销售录入表</li>
    </ol>
</div>

<div class="table-wrapper">
    <div class="toolbar">
        <form role="form">
            <div class="row">
                <label class="input">财务员工号：</label>
                <label class="input"><input type="text" class="form-control input-md" ng-model="q.userId"> </label>
                <label class="input">时间：</label>
                <label class="input"><input type="text"  id="datetimepickerStart"  class="form-control" ng-model="q.startTime"></label>
                <button ng-click="upload()" class="btn btn-sm btn-primary noprint"><i class="fa fa-search"></i> 录入 </button>
                <button ng-click="printPage()" class="btn btn-sm btn-primary noprint pull-right"><i class="fa fa-print"></i>打印</button>
            </div>
        </form>
    </div>

    <table class="table table-striped table-hover props table-sm table-bordered table-condensed">
        <thead>
        <tr>
            <td width="18%" colspan="2" class="message tableContentAdjust">XXX门店</td>
            <td width="81%" colspan="9" class="message tableContentAdjust">LPG销售情况(今日实际销售)</td>
        </tr>

        <tr>
            <td width="18%" colspan="2" class="message tableContentAdjust">品名项目</td>
            <td width="18%" colspan="2" class="message tableContentAdjust">现金</td>
            <td width="18%" colspan="2" class="message tableContentAdjust">赊销</td>
            <td width="18%" colspan="2" class="message tableContentAdjust">月结</td>
            <td width="18%" colspan="2" class="message tableContentAdjust">气票</td>
            <td width="9%" rowspan="2" class="message tableContentAdjust">优惠券</td>
        </tr>

        <tr>
            <td width="9%" class="message tableContentAdjust">品名</td>
            <td width="9%" class="message tableContentAdjust">规格</td>

            <td width="9%" class="message tableContentAdjust">数量</td>
            <td width="9%" class="message tableContentAdjust">金额</td>

            <td width="9%" class="message tableContentAdjust">数量</td>
            <td width="9%" class="message tableContentAdjust">金额</td>

            <td width="9%" class="message tableContentAdjust">数量</td>
            <td width="9%" class="message tableContentAdjust">金额</td>

            <td width="9%" class="message tableContentAdjust">数量</td>
            <td width="9%" class="message tableContentAdjust">金额</td>
        </tr>

        </thead>
        <tbody>
        <!--可以根据后台获取的品项个数来动态添加-->
        <!--<tr ng-repeat="item in vm.goodsTypes">-->
        <tr ng-repeat="item in vm.goodsTypes">
            <td width="9%" class="message tableContentAdjust">{{item.name}}</td>

            <td width="9%" class="message tableContentAdjust">{{item.type}}</td>
            <td width="9%" class="message tableContentAdjust">
                <label class="input"><input type="text" maxlength="10"  class="form-control inputStyle" ng-model="item.cashQuantity"></label>
            </td>
            <td width="9%" class="message tableContentAdjust">
                <label class="input"><input type="text" maxlength="10"  class="form-control inputStyle" ng-model="item.cashSum"></label>
            </td>
            <td width="9%" class="message tableContentAdjust">
                <label class="input"><input type="text" maxlength="10"  class="form-control inputStyle" ng-model="item.creditQuantity"></label>
            </td>
            <td width="9%" class="message tableContentAdjust">
                <label class="input"><input type="text" maxlength="10"  class="form-control inputStyle" ng-model="item.creditSum"></label>
            </td>
            <td width="9%" class="message tableContentAdjust">
                <label class="input"><input type="text" maxlength="10"  class="form-control inputStyle" ng-model="item.monthlySumQuantity"></label>
            </td>

            <td width="9%" class="message tableContentAdjust">
                <label class="input"><input type="text" maxlength="10"  class="form-control inputStyle" ng-model="item.monthlySum"></label>
            </td>

            <td width="9%" class="message tableContentAdjust">
                <label class="input"><input type="text" maxlength="10"  class="form-control inputStyle" ng-model="item.gasTicketQuantity"></label>
            </td>

            <td width="9%" class="message tableContentAdjust">
                <label class="input"><input type="text" maxlength="10"  class="form-control inputStyle" ng-model="item.gasTicketSum"></label>
            </td>
            <td width="9%" class="message tableContentAdjust">
                <label class="input"><input type="text" maxlength="10"  class="form-control inputStyle" ng-model="item.coupon"></label>
            </td>

        </tr>

        </tbody>
    </table>

    <!--<form role="form">-->
        <!--<div class="panel-body">-->
            <!--<ul class="nav nav-tabs">-->
                <!--<li class="active"><a href="#tab_1" data-toggle="tab">LPG销售情况</a></li>-->
                <!--<li><a href="#tab_2" data-toggle="tab">LPG销售往来管理</a></li>-->
                <!--<li><a href="#tab_3" data-toggle="tab">LPG销售现金管理</a></li>-->
            <!--</ul>-->
            <!--<div class="tab-content">-->
                <!--<div class="tab-pane active" id="tab_1">-->
                    <!--<table class="table table-striped table-hover props table-sm table-bordered table-condensed">-->
                        <!--<thead>-->
                        <!--<tr>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">XXX门店</td>-->
                            <!--<td width="81%" colspan="10" class="message tableContentAdjust">LPG销售情况(今日实际销售)</td>-->
                        <!--</tr>-->

                        <!--<tr>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">品名项目</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">现金</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">赊销</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">月结</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">气票</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">优惠券</td>-->
                        <!--</tr>-->

                        <!--</thead>-->
                        <!--<tbody>-->
                        <!--&lt;!&ndash;可以根据后台获取的品项个数来动态添加&ndash;&gt;-->
                        <!--&lt;!&ndash;<tr ng-repeat="item in vm.goodsTypes">&ndash;&gt;-->
                        <!--<tr ng-repeat="item in vm.goodsTypes">-->
                            <!--<td width="4%" class="message tableContentAdjust">{{item.name}}</td>-->

                        <!--</tr>-->

                        <!--<tr>-->
                            <!--<td width="20%" class="message tableContentAdjust">小计</td>-->

                        <!--</tr>-->

                        <!--</tbody>-->
                    <!--</table>-->
                <!--</div>-->

                <!--<div class="tab-pane" id="tab_2">-->
                    <!--<table class="table table-striped table-hover props table-sm table-bordered table-condensed">-->
                        <!--<thead>-->
                        <!--<tr>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">XXX门店</td>-->
                            <!--<td width="81%" colspan="10" class="message tableContentAdjust">LPG销售情况(今日实际销售)</td>-->
                        <!--</tr>-->

                        <!--<tr>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">品名项目</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">现金</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">赊销</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">月结</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">气票</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">优惠券</td>-->
                        <!--</tr>-->

                        <!--</thead>-->
                        <!--<tbody>-->
                        <!--&lt;!&ndash;可以根据后台获取的品项个数来动态添加&ndash;&gt;-->
                        <!--&lt;!&ndash;<tr ng-repeat="item in vm.goodsTypes">&ndash;&gt;-->
                        <!--<tr ng-repeat="item in vm.goodsTypes">-->
                            <!--<td width="4%" class="message tableContentAdjust">{{item.name}}</td>-->

                        <!--</tr>-->

                        <!--<tr>-->
                            <!--<td width="20%" class="message tableContentAdjust">小计</td>-->

                        <!--</tr>-->

                        <!--</tbody>-->
                    <!--</table>-->
                <!--</div>-->

                <!--<div class="tab-pane" id="tab_3">-->
                    <!--<table class="table table-striped table-hover props table-sm table-bordered table-condensed">-->
                        <!--<thead>-->
                        <!--<tr>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">XXX门店</td>-->
                            <!--<td width="81%" colspan="10" class="message tableContentAdjust">LPG销售情况(今日实际销售)</td>-->
                        <!--</tr>-->

                        <!--<tr>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">品名项目</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">现金</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">赊销</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">月结</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">气票</td>-->
                            <!--<td width="18%" colspan="2" class="message tableContentAdjust">优惠券</td>-->
                        <!--</tr>-->

                        <!--</thead>-->
                        <!--<tbody>-->
                        <!--&lt;!&ndash;可以根据后台获取的品项个数来动态添加&ndash;&gt;-->
                        <!--&lt;!&ndash;<tr ng-repeat="item in vm.goodsTypes">&ndash;&gt;-->
                        <!--<tr ng-repeat="item in vm.goodsTypes">-->
                            <!--<td width="4%" class="message tableContentAdjust">{{item.name}}</td>-->

                        <!--</tr>-->

                        <!--<tr>-->
                            <!--<td width="20%" class="message tableContentAdjust">小计</td>-->

                        <!--</tr>-->

                        <!--</tbody>-->
                    <!--</table>-->
                <!--</div>-->
            <!--</div>-->
        <!--</div>-->
    <!--</form>-->


</div>